<!DOCTYPE html>
<html>
	<head>
		<link rel="stylesheet" type="text/css" href="css/index.css">
	</head>
	<body>
		<div>
			<div class="input-container"> 
				<input class="user-input" type="text" name="numbers" readonly="readonly"/>
			</div>
			<div class="buttons-keyboard">
				<div class="line-container">
					<input class="invisible" type="button" value=""/>
					<input class="invisible" type="button" value=""/>
					<input class="operator-input" type="button" value="%" onclick="getResult();"/>
					<input class="operator-input" type="button" value="AC" onclick="clearInput();"/>
				</div>
				<div class="line-container">
					<input class="num-input" type="button" value="7"/>
					<input class="num-input" type="button" value="8"/>
					<input class="num-input" type="button" value="9"/>
					<input class="operator-input" type="button" value="/"/>
				</div>
				<div class="line-container">
					<input class="num-input" type="button" value="4"/>
					<input class="num-input" type="button" value="5"/>
					<input class="num-input" type="button" value="6"/>
					<input class="operator-input" type="button" value="X"/>
				</div>
				<div class="line-container">
					<input class="num-input" type="button" value="1"/>
					<input class="num-input" type="button" value="2"/>
					<input class="num-input" type="button" value="3"/>
					<input class="operator-input" type="button" value="-"/>
				</div>
				<div class="line-container">
					<input class="num-input" type="button" value="0"/>
					<input class="dot-input" type="button" value="."/>
					<input class="operator-equal" type="button" value="=" onclick="getResult();"/>
					<input class="operator-input" type="button" value="+"/>
				</div>
			</div>
		</div>
		<script src="scripts/calculate.js"></script>
	</body>
</html>